<!-- 系统环境 -->
<template>
  <div class="system-environment">
    <el-card class="!border-none" shadow="never">
      <div>服务器信息</div>
      <div class="mt-4">
        <el-table :data="info.server">
          <el-table-column prop="param" label="参数"></el-table-column>
          <el-table-column prop="value" label="值"></el-table-column>
        </el-table>
      </div>
    </el-card>

    <el-card shadow="never" class="!border-none mt-4">
      <div>PHP环境要求</div>
      <div class="mt-4">
        <el-table :data="info.env">
          <el-table-column prop="option" label="选项"></el-table-column>
          <el-table-column prop="require" label="要求"></el-table-column>
          <el-table-column label="状态">
            <template #default="scope">
              <icon
                v-if="scope.row.status"
                name="el-icon-Select"
                class="text-success"
              />
              <icon v-else name="el-icon-CloseBold" class="text-danger" />
            </template>
          </el-table-column>
          <el-table-column prop="remark" label="说明及帮助"></el-table-column>
        </el-table>
      </div>
    </el-card>

    <el-card shadow="never" class="!border-none mt-4">
      <div>目录权限</div>
      <div class="mt-4">
        <el-table :data="info.auth">
          <el-table-column prop="dir" label="选项"></el-table-column>
          <el-table-column prop="require" label="要求"></el-table-column>
          <el-table-column label="状态">
            <template #default="scope">
              <icon
                v-if="scope.row.status"
                name="el-icon-Select"
                class="text-success"
              />
              <icon v-else name="el-icon-CloseBold" class="text-danger" />
            </template>
          </el-table-column>
          <el-table-column prop="remark" label="说明及帮助"></el-table-column>
        </el-table>
      </div>
    </el-card>
  </div>
</template>

<script lang="ts" setup name="environment">
import { systemInfo } from "@/api/setting/system";
const info = reactive({
  server: [], // 服务器信息
  env: [], // PHP环境要求
  auth: [], // 目录权限
});

const getSystemInfo = () => {
  systemInfo().then((res) => {
    info.server = res.server;
    info.env = res.env;
    info.auth = res.auth;
  });
};

onMounted(() => {
  getSystemInfo();
});
</script>

<style lang="scss" scoped></style>
